interface CardItem {
  url: string,
  icon: string,
  name: string,
  description: string
}

const navigationList: {
  name: string,
  value: string,
  items: CardItem[]
}[] = [{
  name: 'Vue',
  value: 'vue',
  items: [
    {
      url: 'https://cn.vuejs.org/',
      icon: '',
      name: 'Vue官网',
      description: '渐进式 JavaScript 框架',
    },
    {
      url: 'https://v3.cn.vuejs.org/api/',
      icon: '',
      name: 'Vue3 API',
      description: '渐进式 JavaScript 框架',
    },
    {
      url: 'https://cli.vuejs.org/zh/',
      icon: '',
      name: 'Vue CLI',
      description: 'Vue.js 开发的标准工具（脚手架）',
    },
    {
      url: 'https://cn.vitejs.dev/',
      icon: 'https://cn.vitejs.dev/logo.svg',
      name: 'Vite',
      description: '下一代前端开发与构建工具',
    },
    {
      url: 'https://vueuse.org/',
      icon: 'https://vueuse.org/favicon.svg',
      name: 'VueUse',
      description: '基本Vue合成的实用函数集合',
    },
  ]
},
{
  name: 'React',
  value: 'react',
  items: [
    {
      url: 'https://react.docschina.org/',
      icon: '',
      name: 'React',
      description: '用于构建用户界面的 JavaScript 库',
    },
    {
      url: 'https://umijs.org/zh-CN',
      icon: '',
      name: 'UmiJS',
      description: '插件化的企业级前端应用框架',
    },
    {
      url: 'https://motion.ant.design/',
      icon: 'https://zos.alipayobjects.com/rmsportal/HzvPfCGNCtvGrdk.png',
      name: 'Motion Design',
      description: '使用 Ant Motion 能够快速在 React 框架中使用动画',
    },
  ]
},
{
  name: 'UI库',
  value: 'uilib',
  items: [
    {
      url: 'https://element-plus.gitee.io/#/zh-CN',
      icon: '',
      name: 'Element Plus',
      description: '基于 Vue 3.0 的桌面端组件库',
    },
    {
      url: 'https://ant.design/index-cn',
      icon: 'https://gw.alipayobjects.com/zos/rmsportal/rlpTLlbMzTNYuZGGCVYM.png',
      name: 'Ant Design',
      description: 'Ant Design UI 组件库',
    },
  ]
},
{
  name: '工具&插件',
  value: 'tools',
  items: [
    {
      url: 'https://github.com/',
      icon: 'https://github.githubassets.com/favicons/favicon-dark.svg',
      name: 'Github',
      description: '代码管理存储库',
    },
    {
      url: 'https://gitee.com/',
      icon: 'https://gitee.com/assets/favicon.ico',
      name: '码云',
      description: '代码托管平台',
    },
    {
      url: 'https://www.tslang.cn/',
      icon: 'https://www.tslang.cn/assets/images/icons/apple-touch-icon-57x57.png',
      name: 'TypeScript',
      description: 'JavaScript的超集',
    },
    {
      url: 'https://www.electronjs.org/',
      icon: 'https://www.electronjs.org/images/favicon.b7a59262df48d6563400baf5671da548.ico',
      name: 'Electron',
      description: '使用 JavaScript，HTML 和 CSS 构建跨平台的桌面应用程序',
    },
    {
      url: 'https://codepen.io/',
      icon: 'https://cpwebassets.codepen.io/assets/favicon/favicon-touch-de50acbf5d634ec6791894eba4ba9cf490f709b3d742597c6fc4b734e6492a5a.png',
      name: 'CodePen',
      description: '一个在线的前端代码编辑工具',
    },
    {
      url: 'https://www.iconfont.cn/',
      icon: 'http://img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg',
      name: 'Iconfont',
      description: '矢量图标管理、交流平台',
    },
    {
      url: 'https://echarts.apache.org',
      icon: 'https://cdn.jsdelivr.net/gh/apache/echarts-website@asf-site/zh/images/favicon.png?_v_=20200710_1',
      name: 'ECharts',
      description: '一个基于 JavaScript 的开源可视化图表库',
    },
    {
      url: 'https://www.makeapie.com',
      icon: 'https://www.makeapie.com/assets/favicon.png',
      name: 'Make A Pie',
      description: '分享你的 ECharts 作品',
    },
    {
      url: 'http://mockjs.com/',
      icon: 'http://mockjs.com/assets/img/logo-2.svg',
      name: 'Mock.js',
      description: '生成随机数据，拦截 Ajax 请求',
    },
    {
      url: 'http://momentjs.cn/',
      icon: 'http://momentjs.cn/static/img/moment-favicon.png',
      name: 'Moment.js',
      description: 'JavaScript 日期处理类库',
    },
    {
      url: 'https://www.lodashjs.com/',
      icon: 'https://www.lodashjs.com/img/logo.png',
      name: 'Lodash',
      description: 'JavaScript 实用工具库',
    },
    {
      url: 'http://www.axios-js.com/',
      icon: 'http://www.axios-js.com/icon/favicon-96x96.png',
      name: 'Axios',
      description: '基于 promise 的 HTTP 库',
    },
    {
      url: 'https://www.sass.hk/',
      icon: 'https://www.sass.hk/favicon.ico',
      name: 'Sass',
      description: '世界上最成熟、最稳定、最强大的专业级CSS扩展语言',
    },
    {
      url: 'http://lesscss.cn/',
      icon: '//s.nodejs.cn/less/ico/favicon.ico',
      name: 'Less',
      description: 'CSS 预处理语言',
    },
    {
      url: 'https://www.bootcdn.cn/',
      icon: 'https://www.bootcdn.cn/assets/ico/favicon.ico?1623516011439',
      name: 'BootCDN',
      description: '稳定、快速、免费的前端开源项目 CDN 加速服务',
    },
    {
      url: 'https://www.jsdelivr.com/',
      icon: 'https://www.jsdelivr.com/img/icon_256x256.png',
      name: 'JsDelivr',
      description: 'A free CDN for Open Source',
    },
    {
      url: 'https://v2.h5player.bytedance.com/',
      icon: '//lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/byted-player-videos/1.0.4/favicon.ico',
      name: '西瓜播放器插件',
      description: '一款带解析器、节省流量的HTML5视频播放器插件',
    },
  ]
},
{
  name: '素材',
  value: 'material',
  items: [
    {
      url: 'https://www.seeseed.com/',
      icon: 'https://www.seeseed.com/favicon.png',
      name: '每日一粒',
      description: '源源不断分享设计好站',
    },
    {
      url: 'https://www.17sucai.com/',
      icon: 'https://www.17sucai.com/static/i/favicon.ico',
      name: '17 素材',
      description: '各种网页特效素材网',
    },
    {
      url: 'https://dribbble.com/',
      icon: 'https://img.seeseed.com/c/9/c9b7f57c73de88708c08979e3a7bd50b.png?x-oss-process=image/resize,w_32,h_32,m_mfit',
      name: 'Dribbble',
      description: '全球优秀设计师最佳交流展示平台',
    }
  ]
},
{
  name: '配色',
  value: 'colours',
  items: [
    {
      url: 'http://zhongguose.com/',
      icon: 'http://zhongguose.com/img/favicon.ico',
      name: '中国色',
      description: '中国元素配色',
    },
    {
      url: 'https://color.uisdc.com/',
      icon: 'https://image.uisdc.com/wp-content/uploads/2018/05/uisdc-ico-apple.jpg',
      name: '优设配色',
      description: '网页配色、设计师配色的实用网页配色工具',
    },
  ]
},
{
  name: '图库',
  value: 'picLib',
  items: [
    {
      url: 'https://pixabay.com/',
      icon: 'https://pixabay.com/apple-touch-icon.png',
      name: 'Pixabay',
      description: 'Pixabay拥有超过2.3百万张优质图片和视频素材',
    },
    {
      url: 'https://www.pexels.com/',
      icon: 'https://www.pexels.com/assets/icons/pexels-icon-644533b609157fd990b1a6675626d63077ae1fb81e819c83f81dc2242877d413.png',
      name: 'Pexels',
      description: '和pixabay 类似的免费高清图片网站',
    },
  ]
},
{
  name: '娱乐',
  value: 'recreation',
  items: [
    {
      url: 'https://www.bilibili.com/',
      icon: 'https://www.bilibili.com/favicon.ico?v=1',
      name: '哔哩哔哩',
      description: '视频弹幕网站',
    },
  ]
}
  ]

export default navigationList